<!DOCTYPE html>
<html lang="en">
  <head>
    <meta charset="UTF-8" />
    <meta http-equiv="X-UA-Compatible" content="IE=edge" />
    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
    <title>Document</title>
  </head>

  <body></body>
  <script>
    // const p = new Promise(function(resolve, reject) {
    //     setTimeout(() => {
    //         // let data = '读取数据库的数据'
    //         // resolve(data) //将参数以成功的形式返回给对象
    //         let undata = '读取数据库失败'
    //         reject(undata)
    //     })
    // }, 1000)
    // console.log(p); //返回的是一个promise 类型的数据
    // p.then((res) => {
    //     console.log(res);
    // }, (err) => {
    //     console.log(err);
    // })
    // 封装一个ajax的请求
    // const p = new Promise(function(resolve, reject) {
    //     let xhr = new XMLHttpRequest()
    //     xhr.open('GET', 'https://api.apiopen.top/getJoke')
    //     xhr.send()
    //     xhr.onreadystatechange = function() {
    //         if (xhr.readyState == 4) {
    //             if (xhr.status >= 200 && xhr.status < 300) {
    //                 resolve(xhr.response)
    //             }
    //         } else {
    //             reject(xhr.status)
    //         }
    //     }
    // })
    // p.then((value) => {
    //         console.log(value);
    //     }, (reason) => {
    //         console.error(reason);
    //     })
    // 申明一个set
    const set = new Set();
    // 里面可以直接放一个数组，最终变成一个集合，但是这个集合不会有重名的现象
    list = ["张三", "李四", "张三"];
    // 往set中进行传值
    const s = new Set(list);
    console.log(s.size); //size判断集合的长度
    // 添加新元素
    s.add("王五");
    console.log(s);
    // 删除元素
    s.delete("张三");
    console.log(s);
    // 判断是否有某一元素
    console.log(s.has("王五"));
    // 清空集合
    s.clear();
    console.log(s);
    //  使用Map
    const m = new Map();
    // 添加元素
    m.set("name", "尚硅谷"); //这时m中就多了一个对象
    const maps = {
      name: "zhangsan",
    };
    m.set("change", function () {
      console.log("加油");
    });
    m.set(maps, ["lishi", "wangwu "]); //map 中可以让对象作为一个键值名
    console.log(m);
    // 获取m的长度
    console.log(m.size);
    // 获取键值，在get中传入键值名
    console.log(m.get(maps));
    // 删除
    m.delete("change"); //传入键值名
    console.log(m.size);

    // 类的使用
    // 使用es5的方法来实例化对象
    function Phone(brand, price) {
      this.brand = brand;
      this.price = price;
    }
    let HuaWei = new Phone("华为", "3999");
    // 向对对象方法中添加方法
    Phone.prototype.hi = function () {
      console.log("我可以打电话");
    };
    HuaWei.hi(); //调用实例对象中的方法
    console.log(HuaWei);

    class shouji {
      constructor(brand, price) {
        //这个函数名称是固定写法
        this.brand = brand;
        this.price = price;
      }
      say() {
        //函数可以直接写在这里面
        console.log("我可以说话");
      }
    }
    let onePlus = new shouji("一加", "3499");
    onePlus.say();
    console.log(onePlus);
    // 实例对象和函数对象的属性是不相通的
    function hanshu() {
      //函数对象
    }
    hanshu.name = "函数";
    hanshu.change = function () {
      console.log("我能改变世界");
    };
    // 实例对象
    let shili = new hanshu();
    // 这是实例对象并不能访问函数对象的值
    console.log(shili.name); //会是一个未定义的数据
    // 只有函数对象原型对象上的数据才和实例对象相通
    hanshu.prototype.age = 23;
    console.log(shili.age);
    // 静态变量
    class jingtai {
      static name = "手机";
    }
    let jingtais = new jingtai();
    console.log(jingtais.name); //打印一个undefined，他是属于类的，而不属于实例的对象
    console.log(jingtai.name); //以类名来调用是可以调用的

    // es6来实现继承
    class father {
      constructor(brand, price) {
        this.brand = brand;
        this.price = price;
      }
      call() {
        console.log("我可以打电话");
      }
    }
    class son extends father {
      constructor(brand, price, size, color) {
        // 调用父类的构造函数来赋除值
        super(brand, price);
        this.size = size;
        this.color = color;
      }
      photo() {
        console.log("我可以拍照");
      }
      // 重写父类中的方法，这样只能调用子类中的同名方法，在es6中，不能调用父类中的同名方法了重写后
      call() {
        console.log("打视频通话");
      }
    }
    // 实例化对象
    let xiaomi = new son("小米", 1999, 12, "黑色");
    console.log(xiaomi);
    xiaomi.call(); //调用父类的方法

    //get和set
    class php {
      get price() {
        console.log("我的价格是");
        return "我爱GG Bond";
      }
      set price(value) {
        console.log("我的值是" + value);
      }
    }
    let p = new php();
    p.price;
    console.log(p.price);
    p.price = "GG Bond";
  </script>
</html>
